import React from 'react';
import { observer } from 'mobx-react';
import { WeaTools, WeaErrorPage, WeaSearchGroup, WeaFormItem, WeaCheckbox, WeaLocaleProvider } from 'ecCom';
import { WeaSwitch } from 'comsMobx';
import CustomConditionItem from '../../public/wf-custom-query/index.js';
import * as _ from 'lodash';
const getLabel = WeaLocaleProvider.getLabel;

@observer
class Condition extends React.Component {

    constructor(){
        super();
        this.fixedFormParams = {};
        this.fieldFormParams = {};
    }

    render() {
        let group = [];
        const { store } = this.props;
        const { fixedCondition, fieldCondition, fixedForm, fieldForm, nodeOption, showDetailField,workflowid } = store;
        /**常用查询条件 */
        const fixedFormParamsTemp = fixedForm.getFormParams();
        for(let param in fixedFormParamsTemp){
            this.fixedFormParams[param] = fixedFormParamsTemp[param];
        }
        fixedForm && fixedForm.isFormInit && fixedCondition.map((v,i)=> {
            let items = [];
            v.items.map(item => {
                if (item.domkey[0] === "nodeid" || item.domkey[0] === "currentnodeid")
                    item = { ...item, dataParams: {workflowid : workflowid} };
                items.push({
                    com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ewtopq@${item.domkey[0]}`}
                        label={`${item.label}`}
                        labelCol={{ span: `${item.labelcol}` }}
                        wrapperCol={{ span: `${item.fieldcol}` }}>
                        <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@0og40u@${item.domkey[0]}`} fieldConfig={item} form={fixedForm} formParams={this.fixedFormParams} onChange={this.changeEvent} onEnterSearch={this.onEnterSearch} />
                    </WeaFormItem>),
                    colSpan: 1
                });
            });
            group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@uwu5km@${i}`} needTigger={true} title={v.title} showGroup={v.defaultshow} items={items} />);
        });
        /**表单字段查询条件 */
        const fieldFormParamsTemp = fieldForm && fieldForm.getFormParams();
        for(let param in fieldFormParamsTemp){
            this.fieldFormParams[param] = fieldFormParamsTemp[param];
        }
        let fieldItems = [];
        fieldForm && fieldForm.isFormInit && fieldCondition.length > 0 && fieldCondition.map(item => {
            if (!showDetailField && item.otherParams.isdetail === 1)
                return true;
            fieldItems.push({
                com: (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@t40vdv@${item.domkey[0]}`}
                    label={`${item.label}`}
                    labelCol={{ span: `${item.labelcol}` }}
                    wrapperCol={{ span: `${item.fieldcol}` }}>
                    {
                        item.conditionType === "CUSTOM" ?
                            <CustomConditionItem ecId={`${this && this.props && this.props.ecId || ''}_CustomConditionItem@8vnf3l@${item.domkey[0]}`} config={item} form={fieldForm} /> :
                            <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@yi48xv@${item.domkey[0]}`} fieldConfig={item} form={fieldForm} formParams={this.fieldFormParams} onEnterSearch={this.onEnterSearch} />
                    }
                </WeaFormItem>)
            });

        });
        const rightComponent = <div style={{ width: "220px" }}>
            <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@qq8vxs`} content={<span style={{ marginRight: "10px" }}>{getLabel(386178, "显示明细字段条件")}</span>} value={showDetailField ? "1" : "0"} onChange={this.controlShowDetailField} />
        </div>;
        if (fieldItems.length > 0)
            group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@z7v9fx@formFiled`} needTigger={true} title={getLabel(21740, "表单字段")} showGroup={true} items={fieldItems} customComponent={rightComponent} />);
        return <div>{group}</div>;
    }
    controlShowDetailField = v => { this.props.store.controlShowDetailField(v) }
    changeEvent = (obj) => {
        if (!obj || _.isEmpty(obj))
            return;
        const { store } = this.props;
        const fixedFormParams = store.fixedForm.getFormParams();
        let fixedFormDatas = store.fixedForm.getFormDatas();
        if ("workflowid" in obj) {      //改变了工作流条件
            let worklflowid = store.workflowid;
            const oldWfid = fixedFormParams && fixedFormParams["workflowid"] || "";
            const newWfid = obj["workflowid"].value;
            store.setWorkflowid(newWfid);
            if(worklflowid != newWfid || newWfid == ""){
                if(fixedFormDatas.nodeid){
                    fixedFormDatas.nodeid = {value:""};
                }
                if(fixedFormDatas.currentnodeid){
                    fixedFormDatas.currentnodeid = {value:""}
                }
                store.appendFixedFormFields(fixedFormDatas);
            }
            store.changeWorkflowid(newWfid);
        }
    }

    onEnterSearch = () =>{
        const { onEnterSearch } = this.props;
        onEnterSearch();
    }
}

export default WeaTools.tryCatch(React,
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@n2ftsp`} msg={props.error ? props.error : getLabel(383324, ' 对不起，该页面异常，请联系管理员 ') + '！'} />,
    { error: "" }
)(Condition);